// 所有自定义指令

// 处理图片异常  最基本的手段 监测图片dom的error事件
export const imageerror = { //      这样单独导出 可以导出很多个
  // 指令的参数
  // inserted当指令作用的dom对象插入元素之后触发
  // 将指令作用在图片上 当图片出现问题 我们就会拿到dom然后去监听
  inserted(dom, options) { // 指令作用于谁 谁就是dom
    dom.src = dom.src || options.value
    //   图片异常的逻辑
    //  监听img标签的错误事件  因为图片加载失败 会触发  onerror事件
    // options是一个对象 里面有个值叫value 从value中读取传过来的值
    // 图片只要异常 就处理图片 给个默认值(默认图片)
    dom.onerror = function() {
      dom.src = options.value // 传进来这个值
    }
  },
  componentUpdated(dom, options) {
    dom.src = dom.src || options.value
  }
}
// Vue.directive('imageerror', imageerror) // 指令名也叫imageerror 再将这个对象传进去
// Vue.directive('指令名',{
//      函数体
// })
